<template>
  <div class="home">
    <div class="tab-bar">
      <router-view />
      <van-tabbar route active-color="#000000" inactive-color="#666666">
        <van-tabbar-item replace to="/Index">
          <span>首页</span>
          <template #icon="props">
            <img :src="props.active ? icon.homeActive : icon.homeInactive" />
          </template>
        </van-tabbar-item>
        <van-tabbar-item replace to="/PersonalCenter">
          <span>我的</span>
          <template #icon="props">
            <img :src="props.active ? icon.active : icon.inactive" />
          </template>
        </van-tabbar-item>
      </van-tabbar>
    </div>
  </div>
</template>

<script>

export default {
  name: 'Home',
  data() {
    return {
      icon: {
        inactive: require('../assets/image/C端icon／标签栏／我的／默认备份.png'),
        active: require('../assets/image/C端icon／标签栏／我的／选中备份_1.png'),
        homeInactive: require('../assets/image/C端icon／标签栏／首页／默认备份_1.png'),
        homeActive: require('../assets/image/C端icon／标签栏／首页／选中备份.png')
      }
    }
  }
}
</script>

<style lang="less" scoped>
  .van-tabbar{
    .van-tabbar-item{
      span{
        font-size: 10px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
      }
    }
    
  }
</style>
